<template>
  <div class="mark-wrapper">
    <el-row>
        <el-col :xs="24" :sm="24" :lg="24" class="primary">质量KPI</el-col>
    </el-row>
    <el-row>
        <el-col :xs="24" :sm="24" :lg="24" class="border"></el-col>
    </el-row>
    <el-row>
      <el-col :xs="24" :sm="24" :lg="24">
        <v-choose :isShowProj="false" dateType="year"></v-choose>        
      </el-col>
    </el-row>
   
  <!-- <h2 style="color: #409EFF;">评分模型配置</h2> -->
  <el-row>
    <el-col :xs="24" :sm="24" :lg="24" class="report_addressee">评分配置</el-col>
  </el-row>
  <el-form :model="ruleForm" :rules="ruleForm.rules" ref="ruleForm">
    <el-tabs class="marT" type="border-card" v-model="activeName">
      <el-tab-pane label="客户满意度管理--客户投诉" name="0">       
        <div v-if="activeName == 0" key="zero" class="supplement-table bgColor" style="position: relative;">
          <el-row>
            <el-col :xs="24" :sm="24" :lg="24">
              
              <div class="totalButton">
                <el-button @click="save" size="mini" round type="primary" :disabled="error">保存提交</el-button>
              </div>
                <el-table
                  :border="true"               
                  :header-cell-style="{background:'#eef1f6'}"
                  :data="ruleForm.customer_complaint"                      
                  style="width: 100%"
                  :row-class-name="tableRowClassName">
                  <el-table-column
                    label="客户满意度管理--客户投诉"
                    align="center"> 
                    <el-table-column
                      label="类别"
                      align="center"
                      prop="name"
                      >
                    </el-table-column>
                    <el-table-column
                      label="目标"
                      align="center"
                      > 
                      <template slot-scope="scope">
                        <div v-if="scope.row.status" class="flexBox">
                          <div class="flexItem">
                            <el-select v-model="scope.row.operator" placeholder="请选择目标">
                              <el-option
                                v-for="item in optionsGoal"
                                :key="item.value"
                                :label="item.label"
                                :value="item.value">
                              </el-option>
                            </el-select>
                          </div>
                          <div class="flexItem">
                            <el-form-item 
                              v-if="scope.row.status"
                              :style="error ? 'marginBottom: 30px' : 'marginBottom: 0'" 
                              :prop="'customer_complaint.' + scope.$index + '.indicator'"
                              :rules="ruleForm.rules.pass">
                              <el-input 
                                v-model="scope.row.indicator" 
                                autocomplete="off">
                              </el-input>
                            </el-form-item>
                          </div>
                          <div class="flexItem flexSpan">
                            <span class="goal" v-html="scope.row.type == 'percent' ? '%' : scope.row.type"></span>
                          </div>            
                        </div>
                        <div v-else>
                          <div v-if="scope.row.type == 'percent'">
                            <div v-if="scope.row.operator == 0">>{{ scope.row.indicator }}%</div>
                            <div v-else-if="scope.row.operator == 1"><{{ scope.row.indicator }}%</div>
                            <div v-else-if="scope.row.operator == 2">>={{ scope.row.indicator }}%</div>
                            <div v-else-if="scope.row.operator == 3"><={{ scope.row.indicator }}%</div>
                            <div v-else>={{ scope.row.indicator }}%</div>
                          </div>
                          <div v-else>
                            <div v-if="scope.row.operator == 0">>{{ scope.row.indicator }}{{ scope.row.type }}</div>
                            <div v-else-if="scope.row.operator == 1"><{{ scope.row.indicator }}{{ scope.row.type }}</div>
                            <div v-else-if="scope.row.operator == 2">>={{ scope.row.indicator }}{{ scope.row.type }}</div>
                            <div v-else-if="scope.row.operator == 3"><={{ scope.row.indicator }}{{ scope.row.type }}</div>
                            <div v-else>={{ scope.row.indicator }}</div>
                          </div>
                        </div>
                      </template>
                    </el-table-column>
                    <el-table-column
                      label="权重"
                      align="center"
                      > 
                      <template slot-scope="scope">
                        <div class="flexBox" v-if="scope.row.status">
                          <el-form-item 
                            class="flexItem"                          
                            :style="error ? 'marginBottom: 30px' : 'marginBottom: 0'" 
                            :prop="'customer_complaint.' + scope.$index + '.weight'"
                            :rules="ruleForm.rules.pass">
                            <el-input 
                              v-model="scope.row.weight" 
                              autocomplete="off">
                            </el-input>            
                          </el-form-item>
                          <div class="flexItem flexSpan">
                            <span class="goal" v-html="scope.row.type == 'percent' ? '%' : scope.row.type"></span>
                          </div>
                        </div>
                        <div v-else v-html="scope.row.type == 'percent' ? scope.row.weight+'%' : scope.row.weight+scope.row.type"></div>
                      </template>    
                    </el-table-column>
                    <el-table-column fixed="right" align="center" label="操作">
                      <template slot-scope="scope">
                        <div style="margin-bottom: 5px;">
                          <el-button :disabled="!scope.row.add_item" @click="change(scope.row, scope.$index, ruleForm.customer_complaint)" size="mini" round type="success">修改</el-button>
                        </div>
                        <div v-if="scope.row.status" style="margin-bottom: 5px;">
                          <el-button @click="cancel(scope.row, scope.$index, ruleForm.customer_complaint)" size="mini" round type="warning">取消</el-button>
                        </div>                        
                      </template> 
                    </el-table-column>   
                    <el-table-column
                      align="center"
                      width="150"
                      label="过程质量是否启用">  
                      <template slot-scope="scope">
                        <el-select @change="change1(ruleForm.customer_complaint, scope.row, 'customer_complaint')" v-model="scope.row.add_item" placeholder="是否启用">
                          <el-option
                            v-for="item in option"
                            :key="item.value"
                            :label="item.label"
                            :value="item.value">
                          </el-option>
                        </el-select>
                      </template>                 
                    </el-table-column>                 
                  </el-table-column>                  
                </el-table>
              <!--</el-form>-->
            </el-col>
          </el-row>
        </div>
      </el-tab-pane>
      <el-tab-pane label="阶段点评审" name="1">
        <el-row>
            <el-col :xs="24" :sm="24" :lg="24">
              <!--<el-form :model="ruleForm" :rules="ruleForm.rules" ref="ruleForm"> -->
                <div class="totalButton">
                  <el-button @click="save" size="mini" round type="primary" :disabled="error">保存提交</el-button>
                </div>
                <el-table
                  :border="true"
                  :header-cell-style="{background:'#eef1f6'}"
                  :data="ruleForm.period"                      
                  style="width: 100%"
                  :row-class-name="tableRowClassName"
                  @selection-change="handleSelectionChange2">
                  <el-table-column
                    label="阶段点评审"
                    align="center">
                    <el-table-column
                      label="类别"
                      align="center"
                      prop="name"
                      >
                    </el-table-column>
                    <el-table-column
                      label="目标"
                      align="center"
                      > 
                      <template slot-scope="scope">
                        <div v-if="scope.row.status" class="flexBox">
                          <div class="flexItem">
                            <el-select v-model="scope.row.operator" placeholder="请选择目标">
                              <el-option
                                v-for="item in optionsGoal"
                                :key="item.value"
                                :label="item.label"
                                :value="item.value">
                              </el-option>
                            </el-select>
                          </div>
                          <div class="flexItem">
                            <el-form-item 
                              v-if="scope.row.status"
                              :style="error ? 'marginBottom: 30px' : 'marginBottom: 0'" 
                              :prop="'period.' + scope.$index + '.indicator'"
                              :rules="ruleForm.rules.pass">
                              <el-input 
                                v-model="scope.row.indicator" 
                                autocomplete="off">
                              </el-input>
                            </el-form-item>
                          </div>
                          <div class="flexItem flexSpan">
                            <span class="goal" v-html="scope.row.type == 'percent' ? '%' : scope.row.type"></span>
                          </div>            
                        </div>
                        <div v-else>
                          <div v-if="scope.row.type == 'percent'">
                            <div v-if="scope.row.operator == 0">>{{ scope.row.indicator }}%</div>
                            <div v-else-if="scope.row.operator == 1"><{{ scope.row.indicator }}%</div>
                            <div v-else-if="scope.row.operator == 2">>={{ scope.row.indicator }}%</div>
                            <div v-else-if="scope.row.operator == 3"><={{ scope.row.indicator }}%</div>
                            <div v-else-if="scope.row.operator == 4">={{ scope.row.indicator }}%</div>
                            <div v-else-if="scope.row.operator == 5">[-{{ scope.row.indicator }}%, {{scope.row.indicator}}%]</div>
                            <div v-else>(-{{ scope.row.indicator }}%, {{scope.row.indicator}}%)</div>
                          </div>
                          <div v-else>
                            <div v-if="scope.row.operator == 0">>{{ scope.row.indicator }}{{ scope.row.type }}</div>
                            <div v-else-if="scope.row.operator == 1"><{{ scope.row.indicator }}{{ scope.row.type }}</div>
                            <div v-else-if="scope.row.operator == 2">>={{ scope.row.indicator }}{{ scope.row.type }}</div>
                            <div v-else-if="scope.row.operator == 3"><={{ scope.row.indicator }}{{ scope.row.type }}</div>
                            <div v-else-if="scope.row.operator == 4">={{ scope.row.indicator }}{{ scope.row.type }}</div>
                            <div v-else-if="scope.row.operator == 5">[-{{ scope.row.indicator }}{{ scope.row.type }}, {{scope.row.indicator}}{{ scope.row.type }}]</div>
                            <div v-else>(-{{ scope.row.indicator }}{{ scope.row.type }}, {{scope.row.indicator}}{{ scope.row.type }})</div>
                          </div>
                        </div>
                      </template>
                    </el-table-column>
                    <el-table-column
                      label="权重"
                      align="center"
                      > 
                      <template slot-scope="scope">
                        <div class="flexBox" v-if="scope.row.status">
                          <el-form-item 
                            class="flexItem"                          
                            :style="error ? 'marginBottom: 30px' : 'marginBottom: 0'" 
                            :prop="'period.' + scope.$index + '.weight'"
                            :rules="ruleForm.rules.pass">
                            <el-input 
                              v-model="scope.row.weight" 
                              autocomplete="off">
                            </el-input>            
                          </el-form-item>
                          <div class="flexItem flexSpan">
                            <span class="goal" v-html="scope.row.type == 'percent' ? '%' : scope.row.type"></span>
                          </div>
                        </div>
                        <div v-else v-html="scope.row.type == 'percent' ? scope.row.weight+'%' : scope.row.weight+scope.row.type"></div>
                      </template>    
                    </el-table-column>
                    <el-table-column fixed="right" align="center" label="操作">
                      <template slot-scope="scope">
                        <div style="margin-bottom: 5px;">
                          <el-button :disabled="!scope.row.add_item" @click="change(scope.row, scope.$index, ruleForm.period)" size="mini" round type="success">修改</el-button>
                        </div>
                        <div v-if="scope.row.status" style="margin-bottom: 5px;">
                          <el-button @click="cancel(scope.row, scope.$index, ruleForm.period)" size="mini" round type="warning">取消</el-button>
                        </div>
                        <!-- <div>
                          <el-button @click="save(scope.row, scope.$index, ruleForm.period)" size="mini" round type="primary" :disabled="error || !scope.row.status">保存</el-button>
                        </div> -->
                      </template> 
                    </el-table-column> 
                    <el-table-column
                      align="center"
                      width="150"
                      label="过程质量是否启用">  
                      <template slot-scope="scope">
                        <el-select @change="change1(ruleForm.period, scope.row, 'period')" v-model="scope.row.add_item" placeholder="是否启用">
                          <el-option
                            v-for="item in option"
                            :key="item.value"
                            :label="item.label"
                            :value="item.value">
                          </el-option>
                        </el-select>
                      </template>                 
                    </el-table-column>
                  </el-table-column>                  
                </el-table>
              <!--</el-form> -->
            </el-col>
        </el-row>
      </el-tab-pane>
      <el-tab-pane label="Bug处理规范" name="2">
        <el-row>
            <el-col :xs="24" :sm="24" :lg="24">
              <!--<el-form :model="ruleForm" :rules="ruleForm.rules" ref="ruleForm"> -->
                <div class="totalButton">
                  <el-button @click="save" size="mini" round type="primary" :disabled="error">保存提交</el-button>
                </div>
                <el-table
                  :border="true"
                  :header-cell-style="{background:'#eef1f6'}"
                  :data="ruleForm.bug"
                  :row-class-name="tableRowClassName"                      
                  style="width: 100%">
                  <el-table-column
                    label="Bug处理规范"
                    align="center">
                    <el-table-column
                      label="类别"
                      align="center"
                      prop="name"
                      >
                    </el-table-column>
                    <el-table-column
                      label="目标"
                      align="center"
                      > 
                      <template slot-scope="scope">
                        <div v-if="scope.row.status" class="flexBox">
                          <div class="flexItem">
                            <el-select v-model="scope.row.operator" placeholder="请选择目标">
                              <el-option
                                v-for="item in optionsGoal"
                                :key="item.value"
                                :label="item.label"
                                :value="item.value">
                              </el-option>
                            </el-select>
                          </div>
                          <div class="flexItem">
                            <el-form-item 
                              v-if="scope.row.status"
                              :style="error ? 'marginBottom: 30px' : 'marginBottom: 0'" 
                              :prop="'bug.' + scope.$index + '.indicator'"
                              :rules="ruleForm.rules.pass">
                              <el-input 
                                v-model="scope.row.indicator" 
                                autocomplete="off">
                              </el-input>
                            </el-form-item>
                          </div>
                          <div class="flexItem flexSpan">
                            <span class="goal" v-html="scope.row.type == 'percent' ? '%' : scope.row.type"></span>
                          </div>            
                        </div>
                        <div v-else>
                          <div v-if="scope.row.type == 'percent'">
                            <div v-if="scope.row.operator == 0">>{{ scope.row.indicator }}%</div>
                            <div v-else-if="scope.row.operator == 1"><{{ scope.row.indicator }}%</div>
                            <div v-else-if="scope.row.operator == 2">>={{ scope.row.indicator }}%</div>
                            <div v-else-if="scope.row.operator == 3"><={{ scope.row.indicator }}%</div>
                            <div v-else>={{ scope.row.indicator }}%</div>
                          </div>
                          <div v-else>
                            <div v-if="scope.row.operator == 0">>{{ scope.row.indicator }}{{ scope.row.type }}</div>
                            <div v-else-if="scope.row.operator == 1"><{{ scope.row.indicator }}{{ scope.row.type }}</div>
                            <div v-else-if="scope.row.operator == 2">>={{ scope.row.indicator }}{{ scope.row.type }}</div>
                            <div v-else-if="scope.row.operator == 3"><={{ scope.row.indicator }}{{ scope.row.type }}</div>
                            <div v-else>={{ scope.row.indicator }}</div>
                          </div>
                        </div>
                      </template>
                    </el-table-column>
                    <el-table-column
                      label="权重"
                      align="center"
                      > 
                      <template slot-scope="scope">
                        <div class="flexBox" v-if="scope.row.status">
                          <el-form-item 
                            class="flexItem"                          
                            :style="error ? 'marginBottom: 30px' : 'marginBottom: 0'" 
                            :prop="'bug.' + scope.$index + '.weight'"
                            :rules="ruleForm.rules.pass">
                            <el-input 
                              v-model="scope.row.weight" 
                              autocomplete="off">
                            </el-input>            
                          </el-form-item>
                          <div class="flexItem flexSpan">
                            <span class="goal" v-html="scope.row.type == 'percent' ? '%' : scope.row.type"></span>
                          </div>
                        </div>
                        <div v-else v-html="scope.row.type == 'percent' ? scope.row.weight+'%' : scope.row.weight+scope.row.type"></div>
                      </template>    
                    </el-table-column>
                    <el-table-column fixed="right" align="center" label="操作">
                      <template slot-scope="scope">
                        <div style="margin-bottom: 5px;">
                          <el-button :disabled="!scope.row.add_item" @click="change(scope.row, scope.$index, ruleForm.bug)" size="mini" round type="success">修改</el-button>
                        </div>
                        <div v-if="scope.row.status" style="margin-bottom: 5px;">
                          <el-button @click="cancel(scope.row, scope.$index, ruleForm.bug)" size="mini" round type="warning">取消</el-button>
                        </div>
                        <!-- <div>
                          <el-button @click="save(scope.row, scope.$index, ruleForm.bug)" size="mini" round type="primary" :disabled="error || !scope.row.status">保存</el-button>
                        </div> -->
                      </template> 
                    </el-table-column> 
                    <el-table-column
                      align="center"
                      width="150"
                      label="过程质量是否启用">  
                      <template slot-scope="scope">
                        <el-select @change="change1(ruleForm.bug, scope.row, 'bug')" v-model="scope.row.add_item" placeholder="是否启用">
                          <el-option
                            v-for="item in option"
                            :key="item.value"
                            :label="item.label"
                            :value="item.value">
                          </el-option>
                        </el-select>
                      </template>                 
                    </el-table-column>
                  </el-table-column>
                </el-table>
              <!--</el-form> -->
            </el-col>
        </el-row>
      </el-tab-pane>
      <el-tab-pane label="版本release" name="3">
        <el-row>
            <el-col :xs="24" :sm="24" :lg="24">
              <!--<el-form :model="ruleForm" :rules="ruleForm.rules" ref="ruleForm">-->
                <div class="totalButton">
                  <el-button @click="save" size="mini" round type="primary" :disabled="error">保存提交</el-button>
                </div>
                <el-table
                  :border="true"
                  :header-cell-style="{background:'#eef1f6'}"
                  :data="ruleForm.release"                      
                  style="width: 100%"
                  :row-class-name="tableRowClassName">
                  <el-table-column
                    label="版本release"
                    align="center">
                    <el-table-column
                      label="类别"
                      align="center"
                      prop="name"
                      >
                    </el-table-column>
                    <el-table-column
                      label="目标"
                      align="center"
                      > 
                      <template slot-scope="scope">
                        <div v-if="scope.row.status" class="flexBox">
                          <div class="flexItem">
                            <el-select v-model="scope.row.operator" placeholder="请选择目标">
                              <el-option
                                v-for="item in optionsGoal"
                                :key="item.value"
                                :label="item.label"
                                :value="item.value">
                              </el-option>
                            </el-select>
                          </div>
                          <div class="flexItem">
                            <el-form-item 
                              v-if="scope.row.status"
                              :style="error ? 'marginBottom: 30px' : 'marginBottom: 0'" 
                              :prop="'release.' + scope.$index + '.indicator'"
                              :rules="ruleForm.rules.pass">
                              <el-input 
                                v-model="scope.row.indicator" 
                                autocomplete="off">
                              </el-input>
                            </el-form-item>
                          </div>
                          <div class="flexItem flexSpan">
                            <span class="goal" v-html="scope.row.type == 'percent' ? '%' : scope.row.type"></span>
                          </div>            
                        </div>
                        <div v-else>
                          <div v-if="scope.row.type == 'percent'">
                            <div v-if="scope.row.operator == 0">>{{ scope.row.indicator }}%</div>
                            <div v-else-if="scope.row.operator == 1"><{{ scope.row.indicator }}%</div>
                            <div v-else-if="scope.row.operator == 2">>={{ scope.row.indicator }}%</div>
                            <div v-else-if="scope.row.operator == 3"><={{ scope.row.indicator }}%</div>
                            <div v-else>={{ scope.row.indicator }}%</div>
                          </div>
                          <div v-else>
                            <div v-if="scope.row.operator == 0">>{{ scope.row.indicator }}{{ scope.row.type }}</div>
                            <div v-else-if="scope.row.operator == 1"><{{ scope.row.indicator }}{{ scope.row.type }}</div>
                            <div v-else-if="scope.row.operator == 2">>={{ scope.row.indicator }}{{ scope.row.type }}</div>
                            <div v-else-if="scope.row.operator == 3"><={{ scope.row.indicator }}{{ scope.row.type }}</div>
                            <div v-else>={{ scope.row.indicator }}</div>
                          </div>
                        </div>
                      </template>
                    </el-table-column>
                    <el-table-column
                      label="权重"
                      align="center"
                      > 
                      <template slot-scope="scope">
                        <div class="flexBox" v-if="scope.row.status">
                          <el-form-item 
                            class="flexItem"                          
                            :style="error ? 'marginBottom: 30px' : 'marginBottom: 0'" 
                            :prop="'release.' + scope.$index + '.weight'"
                            :rules="ruleForm.rules.pass">
                            <el-input 
                              v-model="scope.row.weight" 
                              autocomplete="off">
                            </el-input>            
                          </el-form-item>
                          <div class="flexItem flexSpan">
                            <span class="goal" v-html="scope.row.type == 'percent' ? '%' : scope.row.type"></span>
                          </div>
                        </div>
                        <div v-else v-html="scope.row.type == 'percent' ? scope.row.weight+'%' : scope.row.weight+scope.row.type"></div>
                      </template>    
                    </el-table-column>
                    <el-table-column fixed="right" align="center" label="操作">
                      <template slot-scope="scope">
                        <div style="margin-bottom: 5px;">
                          <el-button :disabled="!scope.row.add_item" @click="change(scope.row, scope.$index, ruleForm.release)" size="mini" round type="success">修改</el-button>
                        </div>
                        <div v-if="scope.row.status" style="margin-bottom: 5px;">
                          <el-button @click="cancel(scope.row, scope.$index, ruleForm.release)" size="mini" round type="warning">取消</el-button>
                        </div>
                        <!-- <div>
                          <el-button @click="save(scope.row, scope.$index, ruleForm.release)" size="mini" round type="primary" :disabled="error || !scope.row.status">保存</el-button>
                        </div> -->
                      </template> 
                    </el-table-column> 
                    <el-table-column
                      align="center"
                      width="150"
                      label="过程质量是否启用">  
                      <template slot-scope="scope">
                        <el-select @change="change1(ruleForm.release, scope.row, 'release')" v-model="scope.row.add_item" placeholder="是否启用">
                          <el-option
                            v-for="item in option"
                            :key="item.value"
                            :label="item.label"
                            :value="item.value">
                          </el-option>
                        </el-select>
                      </template>                 
                    </el-table-column>
                  </el-table-column>
                </el-table>
              <!-- </el-form> -->
            </el-col>
        </el-row>
      </el-tab-pane>
      <el-tab-pane label="持续改进积分" name="4">
        <el-row>
            <el-col :xs="24" :sm="24" :lg="24">              
                <div class="totalButton">
                  <el-button @click="save" size="mini" round type="primary" :disabled="error">保存提交</el-button>
                </div>
                <el-table
                  :border="true"
                  v-loading="loading"
                  :header-cell-style="{background:'#eef1f6'}"
                  :data="ruleForm.improve_score"                      
                  style="width: 100%"
                  :row-class-name="tableRowClassName">
                  <el-table-column
                    label="持续改进积分"
                    align="center">
                    <el-table-column
                      label="类别"
                      align="center"
                      prop="name"
                      >
                    </el-table-column>
                    <el-table-column
                      label="目标"
                      align="center"
                      > 
                      <template slot-scope="scope">
                        <div v-if="scope.row.status" class="flexBox">
                          <div class="flexItem">
                            <el-select v-model="scope.row.operator" placeholder="请选择目标">
                              <el-option
                                v-for="item in optionsGoal"
                                :key="item.value"
                                :label="item.label"
                                :value="item.value">
                              </el-option>
                            </el-select>
                          </div>                      
                          <el-form-item 
                            class="flexItem"                          
                            :style="error ? 'marginBottom: 30px' : 'marginBottom: 0'" 
                            :prop="'improve_score.' + scope.$index + '.indicator'"
                            :rules="ruleForm.rules.pass">
                            <el-input 
                              v-model="scope.row.indicator" 
                              autocomplete="off">                             
                            </el-input>          
                          </el-form-item>
                          <div class="flexItem flexSpan">
                            <span class="goal" v-html="scope.row.type == 'percent' ? '%' : scope.row.type"></span>
                          </div>                               
                        </div>
                        <div v-else>
                          <div v-if="scope.row.type = 'percent'">
                            <div v-if="scope.row.operator == 0">>{{ scope.row.indicator }}%</div>
                            <div v-else-if="scope.row.operator == 1"><{{ scope.row.indicator }}%</div>
                            <div v-else-if="scope.row.operator == 2">>={{ scope.row.indicator }}%</div>
                            <div v-else-if="scope.row.operator == 3"><={{ scope.row.indicator }}%</div>
                            <div v-else>={{ scope.row.indicator }}%</div>
                          </div>
                          <div v-else>
                            <div v-if="scope.row.operator == 0">>{{ scope.row.indicator }}</div>
                            <div v-else-if="scope.row.operator == 1"><{{ scope.row.indicator }}</div>
                            <div v-else-if="scope.row.operator == 2">>={{ scope.row.indicator }}</div>
                            <div v-else-if="scope.row.operator == 3"><={{ scope.row.indicator }}</div>
                            <div v-else>={{ scope.row.indicator }}</div>
                          </div>                   
                        </div>
                      </template>
                    </el-table-column>
                    <el-table-column
                      label="权重"
                      align="center"
                      > 
                      <template slot-scope="scope">
                        <div class="flexBox" v-if="scope.row.status">
                          <el-form-item 
                            class="flexItem"                          
                            :style="error ? 'marginBottom: 30px' : 'marginBottom: 0'" 
                            :prop="'improve_score.' + scope.$index + '.weight'"
                            :rules="ruleForm.rules.pass">
                            <el-input 
                              v-model="scope.row.weight" 
                              autocomplete="off">
                            </el-input>            
                          </el-form-item>
                          <div class="flexItem flexSpan">
                            <span class="goal" v-html="scope.row.type == 'percent' ? '%' : scope.row.type"></span>
                          </div>
                        </div>
                        <div v-else v-html="scope.row.type == 'percent' ? scope.row.weight+'%' : scope.row.weight+scope.row.type"></div>
                      </template>    
                    </el-table-column>
                    <el-table-column fixed="right" align="center" label="操作">
                      <template slot-scope="scope">
                        <div style="margin-bottom: 5px;">
                          <el-button :disabled="!scope.row.add_item" @click="change(scope.row, scope.$index, ruleForm.improve_score)" size="mini" round type="success">修改</el-button>
                        </div>
                        <div v-if="scope.row.status" style="margin-bottom: 5px;">
                          <el-button @click="cancel(scope.row, scope.$index, ruleForm.improve_score)" size="mini" round type="warning">取消</el-button>
                        </div>
                        
                      </template> 
                    </el-table-column>
                    <el-table-column
                      align="center"
                      width="150"
                      label="过程质量是否启用">  
                      <template slot-scope="scope">
                        <el-select @change="change1(ruleForm.improve_score, scope.row, 'improve_score')" v-model="scope.row.add_item" placeholder="是否启用">
                          <el-option
                            v-for="item in option"
                            :key="item.value"
                            :label="item.label"
                            :value="item.value">
                          </el-option>
                        </el-select>
                      </template>                 
                    </el-table-column> 
                  </el-table-column>
                </el-table>             
            </el-col>
        </el-row>
      </el-tab-pane>
      <el-tab-pane label="结果质量" name="5">
        <el-row key="point">
            <el-col :xs="24" :sm="24" :lg="24">
              <!--<el-form :model="ruleForm" :rules="ruleForm.rules" ref="ruleForm">-->
                <div class="totalButton">
                  <el-button @click="save" size="mini" round type="primary" :disabled="error">保存提交</el-button>
                </div>
                <el-table
                    :border="true"
                    :header-cell-style="{background:'#eef1f6'}"
                    :data="ruleForm.pointDatas"                      
                    style="width: 100%"
                    :row-class-name="tableRowClassName2">
                    <el-table-column
                      label="类别"
                      align="center"
                      prop="name"
                      fixed>                       
                    </el-table-column>
                    <el-table-column
                      label="结果质量"
                      align="center">                     
                      <el-table-column
                          label="目标"
                          align="center"                      
                          width="200"
                          > 
                          <template slot-scope="scope">
                            <div v-if="scope.row.status" class="flexBox">
                              <div class="flexItem">
                                <el-select v-model="scope.row.operator" placeholder="请选择目标">
                                  <el-option
                                    v-for="item in optionsGoal"
                                    :key="item.value"
                                    :label="item.label"
                                    :value="item.value">
                                  </el-option>
                                </el-select>
                              </div>
                              <div class="flexItem">
                                <el-form-item 
                                  v-if="scope.row.status"
                                  :style="error ? 'marginBottom: 30px' : 'marginBottom: 0'" 
                                  :prop="'pointDatas.' + scope.$index + '.indicator'"
                                  :rules="ruleForm.rules.pass">
                                  <el-input 
                                    v-model="scope.row.indicator" 
                                    autocomplete="off">
                                  </el-input>
                                </el-form-item>
                              </div>
                              <div class="flexItem flexSpan">
                                <span class="goal" v-html="scope.row.type == 'percent' ? '%' : scope.row.type"></span>
                              </div>            
                            </div>
                            <div v-else>
                              <div v-if="scope.row.type == 'percent'">
                                <div v-if="scope.row.operator == 0">>{{ scope.row.indicator }}%</div>
                                <div v-else-if="scope.row.operator == 1"><{{ scope.row.indicator }}%</div>
                                <div v-else-if="scope.row.operator == 2">>={{ scope.row.indicator }}%</div>
                                <div v-else-if="scope.row.operator == 3"><={{ scope.row.indicator }}%</div>
                                <div v-else>={{ scope.row.indicator }}%</div>
                              </div>
                              <div v-else>
                                <div v-if="scope.row.operator == 0">>{{ scope.row.indicator }}{{ scope.row.type }}</div>
                                <div v-else-if="scope.row.operator == 1"><{{ scope.row.indicator }}{{ scope.row.type }}</div>
                                <div v-else-if="scope.row.operator == 2">>={{ scope.row.indicator }}{{ scope.row.type }}</div>
                                <div v-else-if="scope.row.operator == 3"><={{ scope.row.indicator }}{{ scope.row.type }}</div>
                                <div v-else>={{ scope.row.indicator }}{{ scope.row.type }}</div>
                              </div>
                            </div>
                          </template>
                      </el-table-column>
                      <el-table-column
                        label="权重"
                        align="center"
                        width="120"
                        > 
                        <template slot-scope="scope">
                          <div class="flexBox" v-if="scope.row.status">
                            <el-form-item 
                              class="flexItem"                          
                              :style="error ? 'marginBottom: 30px' : 'marginBottom: 0'" 
                              :prop="'pointDatas.' + scope.$index + '.weight'"
                              :rules="ruleForm.rules.pass">
                              <el-input 
                                v-model="scope.row.weight" 
                                autocomplete="off">
                              </el-input>            
                            </el-form-item>
                            <div class="flexItem flexSpan">
                              <span class="goal">%</span>
                            </div>
                          </div>
                          <div v-else v-html="scope.row.weight+'%'"></div>
                        </template>    
                      </el-table-column>
                        <!-- <el-table-column
                          label="已达标"
                          align="center"                          
                          >
                          <el-table-column
                            label="是否启用"
                            align="center"
                            width="90"> 
                            <template slot-scope="scope">
                              <el-select @change="changeTo($event, scope.$index, scope.row)" :disabled="!scope.row.status" v-model="scope.row.selectStatus" placeholder="是否启用">
                                <el-option
                                  v-for="item in optionsBool"
                                  :key="item.value"
                                  :label="item.label"
                                  :value="item.value">
                                </el-option>
                              </el-select> 
                            </template>   
                          </el-table-column>
                          <el-table-column
                            label="加分上限"
                            align="center"
                            width="120"
                            >
                            <template slot-scope="scope">
                              <div class="flexBox" v-if="scope.row.status && scope.row.selectStatus == 1">
                                <el-form-item 
                                  class="flexItem"                          
                                  :style="error ? 'marginBottom: 35px' : 'marginBottom: 0'" 
                                  :prop="'point_data.' + scope.$index + '.calculation_formula.reach_standard.limit'"
                                  :rules="ruleForm.rules.percentStr">
                                  <el-input 
                                    :disabled="scope.row.selectStatus == 0"
                                    v-model="scope.row.calculation_formula.reach_standard.limit" 
                                    autocomplete="off"
                                    autofocus>
                                  </el-input>            
                                </el-form-item>
                                
                              </div>
                              <div v-else v-html="scope.row.calculation_formula.reach_standard.limit || ''"></div>
                            </template>
                          </el-table-column>
                          <el-table-column
                            label="倍数"
                            align="center"
                            >
                            <template slot-scope="scope">
                              <div class="flexBox" v-if="scope.row.status && scope.row.selectStatus == 1">
                                <el-form-item 
                                  class="flexItem"                          
                                  :style="error ? 'marginBottom: 35px' : 'marginBottom: 0'" 
                                  :prop="'point_data.' + scope.$index + '.calculation_formula.reach_standard.multiple'"
                                  :rules="ruleForm.rules.pass">
                                  <el-input
                                    :disabled="scope.row.selectStatus == 0" 
                                    v-model="scope.row.calculation_formula.reach_standard.multiple" 
                                    autocomplete="off"
                                    >
                                  </el-input>            
                                </el-form-item>        
                              </div>
                              <div v-else v-html="scope.row.calculation_formula.reach_standard.multiple || ''"></div>
                            </template>
                          </el-table-column>
                          <el-table-column
                            label="差值"
                            align="center"
                            width="120"
                            >
                            <template slot-scope="scope">
                              <div class="flexBox" v-if="scope.row.status && scope.row.selectStatus == 1">
                                <el-form-item 
                                  class="flexItem"                          
                                  :style="error ? 'marginBottom: 35px' : 'marginBottom: 0'" 
                                  :prop="'point_data.' + scope.$index + '.calculation_formula.reach_standard.difference'"
                                  :rules="ruleForm.rules.pass">
                                  <el-input 
                                    :disabled="scope.row.selectStatus == 0"
                                    v-model="scope.row.calculation_formula.reach_standard.difference" 
                                    autocomplete="off"
                                    >
                                  </el-input>            
                                </el-form-item>                
                              </div> 
                              <div v-else>
                                <div v-if="scope.row.type == 'percent'">
                                  <div>{{ scope.row.calculation_formula.reach_standard.difference || ''}}<span v-if="scope.row.calculation_formula.reach_standard.difference">%</span></div>
                                </div>
                                <div v-else>
                                  <div>{{ scope.row.calculation_formula.reach_standard.difference || ''}}<span v-if="scope.row.calculation_formula.reach_standard.difference">{{ scope.row.type }}</span></div>
                                </div>
                              </div>                                               
                            </template>
                          </el-table-column>
                        </el-table-column> -->
                        <el-table-column
                          label="未达标"
                          align="center"
                          >
                          <el-table-column
                            label="是否启用"
                            align="center"
                            width="150"> 
                            <template slot-scope="scope">
                              <el-select @change="changeTo2($event, scope.$index, scope.row)" :disabled="!scope.row.status" v-model="scope.row.is_used" placeholder="是否启用">
                                <el-option
                                  v-for="item in optionsBool"
                                  :key="item.value"
                                  :label="item.label"
                                  :value="item.value">
                                </el-option>
                              </el-select> 
                            </template>   
                          </el-table-column>
                          <el-table-column
                            label="扣分上限"
                            align="center"
                            width="150"
                            >
                            <template slot-scope="scope">
                              <div class="flexBox" v-if="scope.row.status && scope.row.is_used">
                                <el-form-item 
                                  class="flexItem"                          
                                  :style="error ? 'marginBottom: 35px' : 'marginBottom: 0'" 
                                  :prop="'pointDatas.' + scope.$index + '.calculation_formula.below_standard.limit'"
                                  :rules="ruleForm.rules.percentStr">
                                  <el-input
                                    :disabled="!scope.row.is_used" 
                                    v-model="scope.row.calculation_formula.below_standard.limit" 
                                    autocomplete="off">
                                  </el-input>            
                                </el-form-item>
                                <!--<div class="flexItem flexSpan">
                                  <span class="goal">分</span>
                                </div>-->
                              </div>
                              <div v-else v-html="scope.row.calculation_formula.below_standard.limit || ''"></div>
                            </template>
                          </el-table-column>
                          <el-table-column
                            label="倍数"
                            align="center"
                            >
                            <template slot-scope="scope">
                              <div class="flexBox" v-if="scope.row.status && scope.row.is_used">
                                <el-form-item 
                                  class="flexItem"                          
                                  :style="error ? 'marginBottom: 35px' : 'marginBottom: 0'" 
                                  :prop="'pointDatas.' + scope.$index + '.calculation_formula.below_standard.multiple'"
                                  :rules="ruleForm.rules.pass">
                                  <el-input 
                                    :disabled="!scope.row.is_used"
                                    v-model="scope.row.calculation_formula.below_standard.multiple" 
                                    autocomplete="off">
                                  </el-input>            
                                </el-form-item>        
                              </div>
                              <div v-else v-html="scope.row.calculation_formula.below_standard.multiple || ''"></div>
                            </template>
                          </el-table-column>
                          <el-table-column
                            label="差值"
                            align="center"
                            width="120"
                            >
                            <template slot-scope="scope">
                              <div class="flexBox" v-if="scope.row.status && scope.row.is_used">
                                <el-form-item 
                                  class="flexItem"                          
                                  :style="error ? 'marginBottom: 35px' : 'marginBottom: 0'" 
                                  :prop="'pointDatas.' + scope.$index + '.calculation_formula.below_standard.difference'"
                                  :rules="ruleForm.rules.pass">
                                  <el-input 
                                    :disabled="!scope.row.is_used"
                                    v-model="scope.row.calculation_formula.below_standard.difference" 
                                    autocomplete="off">
                                  </el-input>            
                                </el-form-item>                           
                              </div>                            
                              <div v-else>
                                <div v-if="scope.row.type == 'percent'">
                                  <div>{{ scope.row.calculation_formula.below_standard.difference || ''}}<span v-if="scope.row.calculation_formula.below_standard.difference">%</span></div>
                                </div>
                                <div v-else>
                                  <div>{{ scope.row.calculation_formula.below_standard.difference || ''}}<span v-if="scope.row.calculation_formula.below_standard.difference">{{ scope.row.type }}</span></div>
                                </div>
                              </div>
                            </template>
                          </el-table-column>
                        </el-table-column> 
                        <el-table-column fixed="right" align="center" label="操作">
                          <template slot-scope="scope">
                            <div v-if="getCondition(scope.row)" style="margin-bottom: 5px;">
                              <el-button @click="change(scope.row, scope.$index, ruleForm.pointDatas)" size="mini" round type="success">修改</el-button>
                            </div>
                            <div v-else style="margin-bottom: 5px;">
                              <el-button :disabled="scope.row.add_item" @click="change(scope.row, scope.$index, ruleForm.pointDatas)" size="mini" round type="success">修改</el-button>
                            </div>
                            <div v-if="scope.row.status" style="margin-bottom: 5px;">
                              <el-button @click="cancel(scope.row, scope.$index, ruleForm.pointDatas)" size="mini" round type="warning">取消</el-button>
                            </div>
                            <!-- <div>
                              <el-button @click="pointSave(scope.row, scope.$index, ruleForm.point_data)" size="mini" round type="primary" :disabled="error || !scope.row.status">保存</el-button>
                            </div> -->
                          </template> 
                        </el-table-column> 
                        <el-table-column
                          align="center"
                          width="150"
                          label="结果质量是否启用">  
                          <template slot-scope="scope">  
                            <el-select v-if="!getCondition(scope.row)" @change="subduction(ruleForm.pointDatas, scope.row)" v-model="scope.row.add_item" placeholder="是否启用">
                              <el-option
                                v-for="item in option2"
                                :key="item.value"
                                :label="item.label"
                                :value="item.value">
                              </el-option>
                            </el-select>
                          </template>                 
                        </el-table-column> 
                    </el-table-column>
                                       
                </el-table>
              <!--</el-form>-->
            </el-col>
        </el-row>
      </el-tab-pane>
    </el-tabs>
  </el-form>
    <div>
      <!-- 项目监管 -->
      <v-supervision ref="supervision"></v-supervision>
    </div>
    <div>
      <el-row>
        <el-col :xs="24" :sm="24" :lg="24" class="report_addressee">月报收件人配置</el-col>
      </el-row>
    <div class="report">
      <div class="reportButton">
          <el-button @click="save_report" round type="primary" :disabled="error">确定</el-button>
      </div>
        <!-- <el-checkbox :indeterminate="isIndeterminate" v-model="checkAll" @change="handleCheckAllChange">全选</el-checkbox>
        <div style="margin: 15px 0;"></div>
          <el-checkbox-group v-model="checkedCities" @change="handleCheckedCitiesChange"> <!--v-model="checkedCities"-->
              <!-- <el-checkbox v-for="city in cities" :label="city" :key="city">{{city}}</el-checkbox> -->
          <!-- </el-checkbox-group> --> 
      
      <div class="report-box">
        <el-transfer v-model="report_value" :data="report_data" :titles="titles"></el-transfer>
      </div>
    </div>
    </div>
  </div>
</template>
<script>
import VChoose from '@/views/data/dataChoose'
import { getHeader } from '@/app.config'
import { mapState } from 'vuex'
import http from '@/views/sys/axios'
import VSupervision from './supervision'

export default {
  components: {
    VChoose,
    VSupervision
  },
  data() {
    var validatePercent = (rule, value, callback) => {
      if (!(/^(\d{1,2}(\.\d{1,3})?|100)$/).test(value)) {
        this.error = true
        callback(new Error('请输入正确的数值'));
      } else {
        this.error = false
        callback()
      }
    };
    var validateNum = (rule, value, callback) => {
      if(!(/^([1-9]\d*|[0]{1,1})$/).test(value)) {
        this.error = true
        callback(new Error('请输入正整数!'));
      } else {
        this.error = false
        callback()
      }
    };
    var validateStr = (rule, value, callback) => {
      if(!(/^[1-9]\d*$/).test(value)) {
        this.error = true
        callback(new Error('请输入正整数!'));
      } else {
        this.error = false
        callback()
      }
    };
    var validatePercentStr = (rule, value, callback) => {
      if (!(/(^$)|^[1-9]\d*$/).test(value)) {
        this.error = true
        callback(new Error('请输入正确的上限'));
      } else {
        this.error = false
        callback()
      }
    };
    return {
      titles: ["待选收件人", "已选收件人"],
      report_data: [],
      report_value: [],
      checkAll: false,
      checkedCities: [],
      isIndeterminate: true,
      multipleSelection: [],
      multipleSelection2: [],
      concatList: [],
      arrList: [],
      error: false,
      success: false,
      loading: true,
      initPointData: [],
      ruleForm: {        
        customer_complaint: [],
        bug: [],
        period: [],
        release: [],
        point_data: [],
        pointDatas: [],
        improve_score: [],        
        rules: {
            pass: [
              { validator: validatePercent, trigger: 'change' }
            ],
            number: [
              { validator: validateNum, trigger: 'change' }
            ],
            str: [
              { validator: validateStr, trigger: 'change' }
            ],
            percentStr: [
              { validator: validatePercentStr, trigger: 'change' }
            ]
          }          
      },
      option2: [
        {
          value: true,
          label: '否'
        },
        {
          value: false,
          label: '是'
        }
      ],
      option: [
        {
          value: false,
          label: '否'
        },
        {
          value: true,
          label: '是'
        }
      ],
      optionsBool: [
        {
          value: false,
          label: '否'
        },
        {
          value: true,
          label: '是'
        }
      ],
      isDisable: 0,
      optionsGoal: [
        {
          value: 0,
          label: '>'
        },
        {
          value: 1,
          label: '<'
        },
        {
          value: 2,
          label: '>='
        },
        {
          value: 3,
          label: '<='
        },
        {
          value: 4,
          label: '='
        },
        {
          value: 5,
          label: '[...]'
        },
        {
          value: 6,
          label: '(...)'
        }
      ],
      optionsPoint: [
        {
          value: 0,
          label: '未达标'
        },
        {
          value: 1,
          label: '达标'
        }
      ],
      valueGoal: '',
      activeName: '0',
      
    }
  },
  computed: {
    ...mapState({
        dataChoose: state => state.dataChoose
    })
  },
  created() {
    if(this.dataChoose.time.indexOf('-') < 0) {
      this.init()      
    } 
  },
  watch: {
    dataChoose: {
      handler: function() {
        if(this.dataChoose.time.indexOf('-') < 0) {
          this.init()         
        }
        if(this.dataChoose.selectId) {
          this.$nextTick(() => {
            this.$refs.supervision.getTable()
          })
        }
      },
      deep: true
    }
  },
  methods: {
    getPercent(num) {
      let percent
      num ? percent = (num * 100).toFixed(2) + '%' : percent = '0.00%'
      return percent
    },
    getCondition(obj) {
      let status = obj.name == '因评审原因导致客户投诉次数' ||
      obj.name == 'Bug degrade比例' ||
      obj.name == '无效版本比例' || 
      obj.name == 'Bug reopen率' || 
      obj.name == 'Bug超期率' ||
      obj.name == '客户投诉次数' || 
      obj.name == 'Bug 逃逸率' || 
      obj.name == 'Bug comments填写规范度' ||
      obj.name == '项目人员替换率'
      return status
    },
    subduction(array, obj) {
      let arr = array.filter(v => !this.getCondition(v))
      
      let remaining = arr.filter(item => !item.add_item)
      
      let concatList = this.initPointData
      this.ruleForm.pointDatas = concatList.concat(remaining)
      
      if(obj.key) {
        this.ruleForm[obj.key].push({
          add_item: true,
          basic_flow: obj.basic_flow,
          indicator: obj.indicator,
          is_used: true,
          name: obj.name,
          key: obj.key,
          operator: obj.operator,
          type: obj.type,
          weight: 1
        })
      }
    },
    change1(array, obj, type) {
      let arr = array.filter(item => !item.add_item)
      .map(item => {
        return {
          add_item: false,
          basic_flow: item.basic_flow,
          calculation_formula: {
            below_standard: {
              limit: "", 
              multiple: 0, 
              difference: 0
            }
          },
          indicator: item.indicator,
          is_used: true,
          key: item.key,
          name: item.name,
          operator: item.operator,
          type: item.type,
          weight: 0,
        }
      })
      let list = array.filter(item => item.add_item)
      
      this.arrList.forEach((value, index) => {
        array.forEach(val => {
          if(value.name === val.name) {
            this.arrList.splice(index, 1)
          }
        })
      })  
      this.ruleForm[type] = list
      //console.log(this.arrList)
      this.arrList = this.arrList.concat(arr).filter(item => !item.add_item) 
      //console.log(this.arrList)
      let a = Object.values(
        this.arrList.reduce((obj, next) => {
          let key = JSON.stringify(next);
          return (obj[key] = next), obj;
        }, {}),
      );
      this.ruleForm.pointDatas = a
    },
    tableRowClassName({row, rowIndex}) {
      if(!row.add_item) {
        return 'disabled'
      }
    },
    tableRowClassName2({row, rowIndex}) {
      if(!row.is_used) {
        return 'disabled'
      }
    },
    handleSelectionChange(val) {
      this.multipleSelection = val
      // console.log(this.multipleSelection)
    },
    handleSelectionChange2(val) {
      this.multipleSelection2 = val
      // console.log(this.multipleSelection2)
    },
    changeTo(val, index, row) {     
      row.selectStatus = val
      if(val == 0 && JSON.stringify(row.calculation_formula.reach_standard) == "{}") {
        row.calculation_formula.reach_standard = {}
      } else if(val == 1 && JSON.stringify(row.calculation_formula.reach_standard) == "{}") {
        row.calculation_formula.reach_standard = {
          difference: 0,
          limit: '',
          multiple: 0
        }
      }
      this.$set(this.ruleForm.pointDatas, index, row)      
    },
    changeTo2(val, index, row) {     
      row.selectStatus2 = val
      if(val == 0 && JSON.stringify(row.calculation_formula.below_standard) == "{}") {
        row.calculation_formula.below_standard = {}
      } else if(val == 1 && JSON.stringify(row.calculation_formula.below_standard) == "{}") {
        row.calculation_formula.below_standard = {
          difference: 0,
          limit: '',
          multiple: 0
        }
      }
      this.$set(this.ruleForm.pointDatas, index, row)      
    },
    toMap(arr) {
      arr.map(item => {
        return {
          add_item: item.add_item,
          basic_flow: item.basic_flow,
          calculation_formula: {
            below_standard: {
              limit: "", 
              multiple: 0, 
              difference: 0
            }
          },
          indicator: item.indicator,
          is_used: item.is_used,
          name: item.name,
          operator: item.operator,
          type: item.type,
          weight: item.weight
        }
      })
      return arr
    },
    init() {
      // this.report_data = []
      // let arr = [
      //   {
      //     label: 'lee',
      //     key: 'l1'
      //   },
      //   {
      //     label: 'ww',
      //     key: 'l2'
      //   },
      //   {
      //     label: 'ee',
      //     key: 'l3'
      //   }
      // ]
      if(this.dataChoose.selectId) {
        http.get(`/api/indicator/examine/entry/indicator?groupId=${this.dataChoose.selectId}&time=${this.dataChoose.time}&source_type=1&report_type=2`).then(res => {
          if(res.code == 200) {
            this.loading = false
            let a = []
            this.report_value = res.data.Selected
            // console.log(this.report_value) 
            if (res.data.ToBeSelect.length > 0){
              for(let i=0; i< res.data.ToBeSelect.length; i++) {
                if (res.data.ToBeSelect[i] in this.report_value){
                  continue
                }else{
                  a.push({
                    label: res.data.ToBeSelect[i],
                    key: res.data.ToBeSelect[i]
                  })
                }
              }
            }
            this.report_data = a;
            // console.log(this.report_data)
            // for (let i = 0;i <=15; i++){
            //   this.report_data.push({
            //     key: i,
            //     label: i,
            //     disabled: false
            //   })
            // }
            // this.report_data = res.data.report
            // if (res.data.report.length > 0){
            //   for(let i = 0;i < this.report_data.length;i++){
            //     // this.report_data.push({
            //     //   key: i,
            //     //   label: this.report_data[i],
            //     // })
            //     console.log(this.report_data[i])
            //   }
            // }     
            //let arrList = []
            this.ruleForm.customer_complaint = res.data.customer_complaint
            if(Array.isArray(this.ruleForm.customer_complaint) && this.ruleForm.customer_complaint.length) {
              this.ruleForm.customer_complaint.forEach(val => {
                val.status = false
              })
            }  
            this.ruleForm.period = res.data.period
            this.ruleForm.period.forEach(val => {
              val.status = false
            })
            this.ruleForm.bug = res.data.bug
            this.ruleForm.bug.forEach(val => {
              val.status = false
            })
            this.ruleForm.release = res.data.release
            this.ruleForm.release.forEach(val => {
              val.status = false
            })
            this.ruleForm.improve_score = res.data.improve_score
            this.ruleForm.improve_score.forEach(val => {
              val.status = false
            })
            this.ruleForm.point_data = res.data.point_data
            this.ruleForm.point_data.forEach(val => {
              val.status = false
              if(JSON.stringify(val.calculation_formula.below_standard) == "{}") {
                val.is_used = false
              } else {
                val.is_used = true
              }
              // if(JSON.stringify(val.calculation_formula.reach_standard) == "{}") {
              //   val.selectStatus = 0
              // } else {
              //   val.selectStatus = 1
              // }       
            }) 
            this.arrList = this.ruleForm.point_data
            this.initPointData = this.ruleForm.point_data.filter(v => this.getCondition(v))
            this.ruleForm.pointDatas = this.initPointData.concat(this.ruleForm.point_data.filter(v => !v.add_item && !this.getCondition(v)))
          } else {
            this.loading = false
          }
        })
      }     
    },
    reload() {
      this.init()
    },
    change(row, index, list) {
      row.status = true
      this.$set(list, index, row)
    },
    cancel(row, index, list) {
      row.status = false
      this.$set(list, index, row)
      this.reload()
    },
    save_report() {
      let data = {
        groupId: this.dataChoose.selectId,
        addressee: this.report_value,
        source_type: 2,
        report_type: 2
      }
      console.log(data)
      http.post(`/api/indicator/examine/report/addressee`, data)
      .then(res => {     
        if(res.code === 200) {
          this.success = true
          this.$message({
            showClose: true,
            message: '收件人配置成功!',
            type: 'success'
          })
          if(this.success) {
            this.reload()
          }
        } else {
          this.$message({
            showClose: true,
            message: res.msg,
            type: 'error'
          })
          this.reload()
        }        
      }).finally(() => {
        this.success = false
      })
    },
    save() {
      // let obj = {}
      let obj = []
      let calculation = {}
      
      if(this.error) {
        this.$message({
          showClose: true,
          message: '您有选项填写错误请检查!',
          type: 'error'
        })
        return
      }          
      // obj = {
      //   basic_flow: row.basic_flow,
      //   indicator: Number(row.indicator),
      //   name: row.name,
      //   operator: row.operator,
      //   type: row.name == '持续改进积分' ? '' : row.type,
      //   weight: Number(row.weight)
      // }
      //if(!this.solveStatus) {
        if(Array.isArray(this.ruleForm.customer_complaint) && this.ruleForm.customer_complaint.length) {
          this.ruleForm.customer_complaint.forEach(val => {
            if(val.is_used) {
              obj.push(val)
            }
          })
        }
      //}
      this.ruleForm.period.forEach(val => {
        if(val.is_used) {
          obj.push(val)
        }
      })
      this.ruleForm.bug.forEach(val => {
        if(val.is_used) {
          obj.push(val)
        }
      })
      this.ruleForm.release.forEach(val => {
        if(val.is_used) {
          obj.push(val)
        }
      })
      this.ruleForm.improve_score.forEach(val => {
        if(val.is_used) {
          obj.push(val)
        }
      })
      
      this.ruleForm.pointDatas.forEach(val => {
        if(val.status) {
          if(val.is_used) {
            calculation = {
                below_standard: {
                  difference: Number(val.calculation_formula.below_standard.difference),
                  limit: Number(val.calculation_formula.below_standard.limit) || '',
                  multiple: Number(val.calculation_formula.below_standard.multiple)
                }               
              }
          } else {
            calculation = {
              below_standard: {}             
            }
          }              
          val.calculation_formula = calculation
          }
          obj.push(val)       
      })
            
      this.$refs['ruleForm'].validate((valid) => {
        if (valid) {
          this.submit(obj, this.dataChoose.time)
          
          this.ruleForm.customer_complaint.forEach(val => {
            val.status = false
          })
          
          this.ruleForm.period.forEach(val => {
            val.status = false
          })
          this.ruleForm.bug.forEach(val => {
            val.status = false
          })
          this.ruleForm.release.forEach(val => {
            val.status = false
          })
          this.ruleForm.improve_score.forEach(val => {
            val.status = false
          })
          this.ruleForm.pointDatas.forEach(val => {
            val.status = false
          })
          
          //this.$set(list, index, row)
        } else {
          this.$message({
            showClose: true,
            message: '提交错误!',
            type: 'error'
          })
          return false
        }
      })
    },
    // pointSave(row, index, list) {
    //   let obj = {}
    //   let calculation = {}
    //   if(row.selectStatus == 0 && row.selectStatus2 == 1) {
    //     calculation = {
    //         below_standard: {
    //           difference: Number(row.calculation_formula.below_standard.difference),
    //           limit: Number(row.calculation_formula.below_standard.limit),
    //           multiple: Number(row.calculation_formula.below_standard.multiple)
    //         },
    //         reach_standard: {}
    //       }
    //   } else if(row.selectStatus == 1 && row.selectStatus2 == 0) {
    //     calculation = {
    //         below_standard: {},
    //         reach_standard: {
    //           difference: Number(row.calculation_formula.reach_standard.difference),
    //           limit: Number(row.calculation_formula.reach_standard.limit),
    //           multiple: Number(row.calculation_formula.reach_standard.multiple)
    //         }
    //       }
    //   } else if(row.selectStatus == 1 && row.selectStatus2 == 1) {
    //     calculation = {
    //         below_standard: {
    //           difference: Number(row.calculation_formula.below_standard.difference),
    //           limit: Number(row.calculation_formula.below_standard.limit),
    //           multiple: Number(row.calculation_formula.below_standard.multiple)
    //         },
    //         reach_standard: {
    //           difference: Number(row.calculation_formula.reach_standard.difference),
    //           limit: Number(row.calculation_formula.reach_standard.limit),
    //           multiple: Number(row.calculation_formula.reach_standard.multiple)
    //         }
    //       }
    //   } else {
    //     calculation = {
    //         below_standard: {},
    //         reach_standard: {}
    //       }
    //   }
      
    //   obj = {
    //     basic_flow: row.basic_flow,
    //     indicator: Number(row.indicator),
    //     name: row.name,
    //     operator: row.operator,
    //     type: row.type,
    //     weight: Number(row.weight),
    //     calculation_formula: calculation
    //   }
    //   this.$refs['ruleForm'].validate((valid) => {
    //     if (valid) {
    //       this.submit(obj, this.dataChoose.time)
    //       row.status = false
    //       this.$set(list, index, row)
    //     } else {
    //       this.$message({
    //         showClose: true,
    //         message: '提交错误!',
    //         type: 'error'
    //       })
    //       return false
    //     }
    //   })
    // },
    submit(data, time) {
      http.post(`/api/indicator/examine/entry/indicator?groupId=${this.dataChoose.selectId}&time=${time}`, data)
      .then(res => {     
        if(res.code === 200) {
          this.success = true
          this.$message({
            showClose: true,
            message: '录入成功!',
            type: 'success'
          })
          if(this.success) {
            this.reload()
          }
        } else {
          this.$message({
            showClose: true,
            message: res.msg,
            type: 'error'
          })
          this.reload()
        }        
      }).finally(() => {
        this.success = false
      })
    }
  }
}
</script>
<style lang="scss" scoped>
  @import '../../assets/common/common.scss';
  /deep/ .el-table th.gutter{
    display: table-cell!important;
  }
  /deep/ .disabled{
    background: #F5F7FA;
  }
  .mark-wrapper{
    padding: 32px;
    background-color: rgb(240, 242, 245);
    position: relative;
  }
  .report-box{
    width: auto;
    font-size: 15px;
    margin-top: 10px;
  }
  /deep/ .el-transfer-panel{
    border: 1px solid #e6ebf5;
    border-radius: 4px;
    overflow: hidden;
    background: #fff;
    display: inline-block;
    vertical-align: middle;
    width: 400px;
    max-height: 100%;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    position: relative;
  }
  .border{
      box-sizing: content-box;
      height: 0;
      overflow: visible;
      margin-top: 1rem;
      margin-bottom: 1rem;
      border: 0;
      border-top: 1px solid rgba(0,0,0,.1);
  }
  .primary{
      color: #409EFF;
      font-size: 30px;
      margin-top: 20px;
      margin-bottom: 10px;
      font-weight: 400;      
  }
  .report {
    background: #fff;
    padding: 10px;
    margin: 10px 0;
  }
  .report_addressee{
      color: #409EFF;
      font-size: 30px;
      margin-top: 40px;
      margin-bottom: 10px;
      font-weight: 400;
  }
  .bgColor{
      background: #fff;
  }
  .pad{
      padding: 0 20px;
      padding-top: 20px;
  }
  .marT{
      margin-top: 20px;
  }
  .totalButton{
    float: right;
    position: relative;
    top: -7px;
  }
  /deep/ .reportButton .el-button--medium.is-round{
    float: right;
    position: relative;
    top: -7px;
    right: 30px;
    padding: 8px 30px;
  }
  /deep/ .totalButton .el-button--mini.is-round{
    padding: 7px 23px;
  }
  .flexBox{
    display: flex;
    align-items: center;
    flex-wrap: nowrap;
    .flexItem{
      flex: 1;
      margin: auto;
      &:first-child{
        margin-right: 5px;
      }      
    }
    .flexSpan{
      flex: 0 0 20px;
    }
  }
</style>